<template>
  <div>
    <h3>{{msgFromChild}}</h3>
    <input v-model="text" />
    <button @click="$emit('addList',text)">提交</button>
    <button @click="clearInput">清空</button>
    <button @click="$emit('removeAll')">重置清单</button>
  </div>
</template>
<script>
  import {ref,onMounted} from "vue";
  import bus from "vue3-eventbus";
  export default{
    props:{
      title:String
    },
    setup(){
      const msgFromChild=ref("")
      const text=ref("")
      const clearInput=()=>{
        text.value=""
      }
      onMounted(()=>{
        bus.on("getMsg",msg=>{
          msgFromChild.value=msg
        })
      })
      return{
        text,
        clearInput,
        msgFromChild
      }
    }
  }
</script>